<template>
  <view class="flex-col page">
    <view class="flex-col flex-auto section">
      <!-- <view class="flex-col items-center space-y-12">
        <image class="image" src="../../static/images/aed322fad816e3fe6116dcb4fbbf16e6.png" />
        <image class="image_2" src="../../static/images/6866b7fbea260e2c8ed1c75aa8f8d91e.png" />
      </view> -->
      <!-- <text class="self-start font_1 text_2">精选新品</text> -->
	  <!-- <uni-grid :column="1" :highlight="true" :square="false" :showBorder="false" class="flex-col group_77 space-y-155 grid-container">
	    <!-- <uni-grid-item v-for="(item, index) in shop" :index="index" :key="index" >  -->
	  <!-- <view for(item,index) in newshop :key="index"> -->
	  <!-- <view class="flex-row items-center group space-x-6">
        <view class="section_2"></view>
        <text class="font_1 text_3">2023年</text>
      </view> -->
	  
	<view class="flex-col flex-auto list" v-for="(item, index) in menulist" :key="index" >
		<view class="flex-row items-center group space-x-6">
		  <view class="section_2"></view>
		  <text class="font_1 text_3">{{item.months}}</text>
		</view>
			<view class="flex-row flex-col" v-for="(it, ind) in menulist[index].shoppings" :key="ind" >
				<view class="flex-row items-center section_3 space-x-14">
				  <image class="image_3" src="../../static/images/be95e27d38f5f237e85677c36f3a90a4.png" />
				  <view class="flex-col items-start flex-auto space-y-10">
				    <text class="font_1 text_4">{{it.name_commodity}}</text>
				    <text class="text_5">{{it.description_commodity}}</text>
				  </view>
				</view>
			</view>			
		</view>			
	</view>		
	  <!-- 	<view class="flex-row items-center group space-x-6">
	  	  <view class="section_2"></view>
	  	  <text class="font_1 text_3">2023年8月</text>
	  	</view>
	  	<view class="flex-row items-center section_3 space-x-14">
	  	  <image class="image_3" src="../../static/images/be95e27d38f5f237e85677c36f3a90a4.png" />
	  	  <view class="flex-col items-start flex-auto space-y-10">
	  	    <text class="font_1 text_4">箱式电阻炉</text>
	  	    <text class="text_5">加热仪器</text>
	  	  </view>
	  	</view> -->
      
      <!-- <view class="flex-row items-center section_3 space-x-14"> -->
     <!--   <image class="image_3" src="../../static/images/be95e27d38f5f237e85677c36f3a90a4.png" />
        <view class="flex-col items-start flex-auto space-y-10"> -->
          <!-- <text class="font_1 text_4">{{item.name_commodity}}</text> -->
          <!-- <text class="text_5">{{item.description_commodity}}</text> -->
     <!--   </view>
      </view> -->
	  <!-- </view> -->
	  <!-- </uni-grid-item>
	  </uni-grid> -->
    </view>
  </view>
</template>

<script>
  import { _newshow} from '@/service/shop.js'
  export default {
    components: {},
    props: {},
    data() {
      return {
		  // shop:[],
		  menulist: [],
		  // serialnum_commodity:'',
		  // name_commodity: '',
		  // number_commodity: 10000,
		  // type_commodity: '',
		  // time_commodity:1000,
		  // description_commodity:  "“加热炉就选我”",
		  // boutique_commodity: 1,
		  // money_commodity: 100,
		  // id_commodity: 1,
	  };
    },
	onShow(){
	  this.	getallshops();
	  console
	},
    methods: {
		async getallshops(){
			let res = await _newshow()
			// this.shop = res.data
			this.menulist = res.data
			// console.log(this.shop);
			console.log(this.menulist);
			// for(let i=0;this.menulist.length>0;i++){
			// 	// console.log(this.menulist[i])
			// }
		}
	},
  };
  
</script>

<style scoped lang="css">
  /* 整个页面垂直方向上都能铺满屏幕 使用 top、right、bottom、left 属性来控制位置 */
  .page {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #e5e5e54d;
	height: 100%;
	width: 100%;
  }

  .section {
    padding: 18.75rpx 33.33rpx 366.67rpx;
    overflow-y: auto;
	height: 100%;
	width: 100%;
  }
  .space-y-12 > view:not(:first-child),
  .space-y-12 > text:not(:first-child),
  .space-y-12 > image:not(:first-child) {
    margin-top: 25rpx;
  }
  .image {
    border-radius: 39.58rpx;
    width: 672.92rpx;
    height: 283.33rpx;
  }
  .image_2 {
    border-radius: 31.25rpx;
    width: 675rpx;
    height: 214.58rpx;
  }
  .font_1 {
    font-size: 27.08rpx;
    font-family: MiSans;
    line-height: 25rpx;
    color: #525252;
  }
  .text_2 {
    margin-left: 29.17rpx;
    margin-top: 37.5rpx;
  }
  .group {
    margin-top: 20.83rpx;
  }
  .space-x-6 > view:not(:first-child),
  .space-x-6 > text:not(:first-child),
  .space-x-6 > image:not(:first-child) {
    margin-left: 12.5rpx;
  }
  .section_2 {
    background-color: #43cf7c;
    border-radius: 8.33rpx;
    width: 16.67rpx;
    height: 35.42rpx;
  }
  .text_3 {
    color: #a6a6a6;
    line-height: 26.04rpx;
  }
  .section_3 {
    margin-top: 33.33rpx;
    padding: 22.92rpx 25rpx;
    background-color: #ffffff;
    border-radius: 20.83rpx;
	width: 700rpx;
	height: 200rpx;
  }
  .space-x-14 > view:not(:first-child),
  .space-x-14 > text:not(:first-child),
  .space-x-14 > image:not(:first-child) {
    margin-left: 29.17rpx;
  }
  .image_3 {
    width: 81.25rpx;
    height: 102.08rpx;
  }
  .space-y-10 > view:not(:first-child),
  .space-y-10 > text:not(:first-child),
  .space-y-10 > image:not(:first-child) {
    margin-top: 20.83rpx;
  }
  .text_4 {
    font-size: 25rpx;
    line-height: 22.92rpx;
  }
  .text_5 {
    color: #00baad;
    font-size: 20.83rpx;
    font-family: SourceHanSansCN;
    line-height: 19.79rpx;
  }
  .list{
	  width: 300rpx;
	  height: 200rpx;
  }
</style>